<!--
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>博客系统</title>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}"></link>
	<style>
		/* 自定义样式，如果需要的话 */
		body {
			padding-top: 50px; /* 为导航栏留出空间（如果有的话） */
			background-color: #f8f9fa; /* 浅灰色背景 */
		}
		.container {
			max-width: 800px; /* 限制容器宽度 */
			margin: 0 auto; /* 居中对齐 */
			padding: 20px;
			background-color: #ffffff; /* 白色背景 */
			box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); /* 阴影效果 */
			border-radius: 8px; /* 圆角 */
		}
		h1 {
			color: #343a40; /* 深灰色标题 */
		}
		a {
			color: #007bff; /* 蓝色链接 */
			text-decoration: none; /* 去除下划线 */
			margin-right: 10px; /* 链接之间的间距 */
			display: inline-block; /* 使链接成为块级元素，以便应用间距 */
		}
		a:hover {
			text-decoration: underline; /* 鼠标悬停时显示下划线 */
		}
		.welcome-message {
			margin-top: 20px; /* 欢迎消息的上边距 */
		}
	</style>
</head>
<body>
<div class="container">
	<h1 class="text-center">博客案例功能列表</h1>
	<div class="welcome-message text-center">
		<p>欢迎您，<span th:text="${username}" class="font-weight-bold"></span></p>
	</div>
	<div class="text-center mt-4">
		<a th:href="@{/articletype/page?pageIndex=0}" class="btn btn-primary mr-2">文章类型列表</a>
		<a th:href="@{/article/findAll}" class="btn btn-success mr-2">文章列表</a>
		<a th:href="@{/user/findAll}" class="btn btn-info mr-2">用户列表</a>
		<a th:href="@{/logout}" class="btn btn-danger">退出</a>
	</div>
</div>
</body>
</html>
-->
<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
	<title>博客系统</title>
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
	<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}"></link>
	<style>
		/* 自定义样式，如果需要的话 */
		body {
			padding-top: 50px; /* 为导航栏留出空间（如果有的话） */
			//background-color: #f0f2f5; /* 更浅的灰色背景 */
			font-family: 'Arial', sans-serif; /* 更改字体 */
			background: url('/img/background.jpg') no-repeat center center fixed;
		}
		.container {
			max-width: 800px; /* 限制容器宽度 */
			margin: 0 auto; /* 居中对齐 */
			padding: 40px; /* 增加内边距 */
			background-color: #ffffff; /* 白色背景 */
			box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1); /* 更强的阴影效果 */
			border-radius: 12px; /* 更大的圆角 */
			box-sizing: border-box; /* 确保内边距和边框不影响宽度 */
		}
		h1 {
			color: #2c3e50; /* 更深的标题颜色 */
			font-weight: 300; /* 更轻的字体粗细 */
			text-align: center;
			margin-bottom: 40px; /* 增加下边距 */
		}
		.welcome-message {
			margin-top: 20px; /* 欢迎消息的上边距 */
			color: #7f8c8d; /* 灰色文字 */
		}
		.welcome-message span {
			color: #3498db; /* 蓝色用户名 */
		}
		a {
			color: #2980b9; /* 链接颜色 */
			text-decoration: none; /* 去除下划线 */
			margin-right: 15px; /* 链接之间的间距 */
			transition: all 0.3s ease; /* 平滑的过渡效果 */
			border-radius: 5px; /* 圆角 */
			padding: 10px 20px; /* 增加内边距 */
			font-size: 16px; /* 字体大小 */
		}
		a:hover {
			background-color: #ecf0f1; /* 鼠标悬停时的背景色 */
			color: #2c3e50; /* 鼠标悬停时的文字颜色 */
			text-decoration: none; /* 鼠标悬停时不显示下划线 */
		}
		.btn-primary, .btn-success, .btn-info, .btn-danger {
			border: none; /* 去除边框 */
			box-shadow: 0px 4px 15px rgba(0, 0, 0, 0.1); /* 阴影效果 */
		}
		.btn-primary {
			background-color: #2980b9; /* 蓝色按钮 */
		}
		.btn-primary:hover {
			background-color: #2471a3; /* 更深的蓝色 */
		}
		.btn-success {
			background-color: #2ecc71; /* 绿色按钮 */
		}
		.btn-success:hover {
			background-color: #27ae60; /* 更深的绿色 */
		}
		.btn-info {
			background-color: #3498db; /* 青色按钮 */
		}
		.btn-info:hover {
			background-color: #2980b9; /* 更深的青色 */
		}
		.btn-danger {
			background-color: #e74c3c; /* 红色按钮 */
		}
		.btn-danger:hover {
			background-color: #c0392b; /* 更深的红色 */
		}
	</style>
</head>
<body>
<div class="container">
	<h1>菜单</h1>
	<div class="welcome-message">
		<p>欢迎您，<span th:text="${username}" class="font-weight-bold"></span><br>
		</p>
	</div>
	<div class="text-center mt-4">
		<a th:href="@{/articletype/page?pageIndex=0}" class="btn btn-primary mr-2">文章类型列表</a>
		<a th:href="@{/article/findAll}" class="btn btn-success mr-2">文章列表</a>
		<a th:href="@{/user/findAll}" class="btn btn-info mr-2">用户列表</a>
		<a th:href="@{/logout}" class="btn btn-danger">退出</a>
	</div>
</div>
</body>
</html>
